<template>
	<view class="wrap">
		<custom-nav-sq-xcx :isBack="true" :hasFixedFlag="true" :bgImage="getQyStaticFilePath('navBg.png')">
			<block slot="content">团体服务评价</block>
		</custom-nav-sq-xcx>
		<create-qy-head :headImgFlag="true">
			<view class="pjItem">
				<view class="ttfwName">减压里立刻就分手发的数据来看手机费</view>
				<view class="innerItem">
					<view class="pjObj">请对服务师评价打分</view>
					<view class="objName">服务讲师：黄利峰</view>
					<view class="rateWrap alignCen">
						<view>评分：</view>
						<htz-rate v-model="teaRateNum" showType="icons" iconName="icon-shoucangon" :size="34" gutter="25" :type="2" clickOpt="teaRate" @change="change" style="vertical-align: middle;"></htz-rate>
					</view>
					<textarea class="pjArea" v-model="teaPjContent" :placeholder="teaPlaceholder" maxlength="200"></textarea>
				</view>
			</view>
			<view class="pjItem">
				<view class="innerItem">
					<view class="pjObj">请对组织方评价打分</view>
					<view class="objName">服务机构：濮阳市心理咨询师协会</view>
					<view class="rateWrap alignCen">
						<view>评分：</view>
						<htz-rate v-model="ogzRateNum" showType="icons" iconName="icon-shoucangon" :size="34" gutter="25" :type="2" clickOpt="ogzRate" @change="change" style="vertical-align: middle;"></htz-rate>
					</view>
					<textarea class="pjArea" v-model="ogzPjContent" :placeholder="ogzPlaceholder" maxlength="200"></textarea>
				</view>
			</view>
			<button class="comBtn qy bigRadius">发表评价</button>
		</create-qy-head>
	</view>
</template>

<script>
	import CreateQyHead from '../../subQyMine/createQy/components/CreateQyHead.vue'
	export default {
		components:{
			CreateQyHead
		},
		data(){
			return{
				teaRateNum:2,
				ogzRateNum:1,
				teaPjContent:'',
				teaPlaceholder:'请输入您对本次服务讲师的评价(200字内)',
				ogzPjContent:'',
				ogzPlaceholder:'请输入您对本次服务组织方的评价(200字内)'
			}
		},
		methods:{
			change(index,clickOpt){
				if(clickOpt == 'teaRate'){
					this.teaRateNum = index;
				}else{
					this.ogzRateNum = index;
				}
			}
		}
	}
</script>
<style lang="scss">
	page{
		background: $pss-qy-mainGray;
	}
</style>
<style lang="scss" scoped>
	.wrap{
		padding-bottom: 1rpx;
	}
	.pjItem{
		background: #fff;
		border-radius: 16rpx;
		padding: 30rpx;
		color: $qy-main2;
		margin-bottom: 30rpx;
		.ttfwName{
			text-align: center;
			font-size: 36rpx;
			font-weight: 600;
			margin-bottom: 40rpx;
		}
		.pjObj{
			font-size: 32rpx;
			font-weight: 600;
		}
		.objName{
			color: $qy-main6;
			font-size: 28rpx;
			margin: 25rpx 0 15rpx;
		}
		.rateWrap{
			color: $qy-main6;
			font-size: 28rpx;
			margin-bottom: 15rpx;
		}
		.pjArea{
			width: 96%;
			padding: 2%;
			height: 280rpx;
			background: #FAF9FE;
			font-size: 28rpx;
			border-radius: 16rpx;
		}
	}
	.comBtn{
		margin: 50rpx 0;
	}
</style>